<template>
  <div>
    <h1>javascript bridge测试</h1>
    <p>用户信息: {{userInfo}}</p>
    <p>jsEcho: {{jsecho}}</p>
    <p>用户token获取: {{ accessToken }}</p>
    <button @click="go2NativePage">拉起原生测试界面</button>
    <button @click="go2GoodsDetailPage">跳转商品详情页测试</button>
    <button @click="go2ShopCarPage">跳转购物车测试</button>
  </div>
</template>

<script>
import { pushToTestPage, pushToShopCartPage, pushToGoodsDetailPage } from '../../common/naviPush'
export default {
  name: 'jsbridge',
  data () {
    return {
      userInfo: '无',
      jsecho: '无',
      accessToken: '未获取到'
    }
  },
  created () {
    this.getUserInfo()
    this.jsEcho()
    this.listenEdit()
    this.getAccessToken()
  },
  methods: {
    getUserInfo () {
      this.jsBridge.getUserInfo({'tip': '获取用户信息'}, (res) => {
        console.log(res)
        this.userInfo = res
      })
    },
    jsEcho () {
      this.jsBridge.jsEcho(res => {
        console.log(res)
        this.jsecho = res
      })
    },
    go2NativePage () {
      pushToTestPage()
    },
    // 监听购物车的编辑状态
    listenEdit () {
      this.jsBridge.shopCartEdit((state) => {
        const { isEdit } = state
        // eslint-disable-next-line
        if (isEdit == true) {
          console.log('原生App触发了编辑按钮')
        } else {
          console.log('原生App触发了完成按钮')
        }
      })
    },
    getAccessToken () {
      this.jsBridge.getAccessToken((token) => {
        console.log('token -> : ', token)
        this.accessToken = token
      })
    },
    go2GoodsDetailPage () {
      pushToGoodsDetailPage(1)
    },
    go2ShopCarPage () {
      pushToShopCartPage()
    }
  }
}
</script>
